
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>fullPage.js 基本演示_fullPage.js全屏滚动插件</title>
<meta name="keywords" content="fullPage.js,全屏滚动,jQuery全屏滚动,fullPage全屏滚动,jQuery插件">
<meta name="description" content="fullPage.js 是一个基于 jQuery 的插件，它能够很方便、很轻松的制作出全屏网站。本站详细介绍fullPage各初始化属性设置。如果你也希望你的网站能设计成全屏的，显得更上档次，你可以试试fullPage.js。">
<link rel="stylesheet" href="./css/jquery.fullPage.css">
<style>
.section { text-align: center; font: 50px "Microsoft Yahei"; color: #fff;}
.section p{font: 30px "Microsoft Yahei";}
</style>
</head>
<body>
<div id="fullPage">
  <div class="section">
    <h3>第一屏</h3>
    <p>fullPage.js — 基本演示</p>
  </div>
  <div class="section">
    <div class="slide">
      <h3>第二屏的第一屏</h3>
    </div>
    <div class="slide">
      <h3>第二屏的第二屏</h3>
    </div>
    <div class="slide">
      <h3>第二屏的第三屏</h3>
    </div>
  </div>
  <div class="section">
    <h3>第三屏</h3>
  </div>
  <div class="section">
    <h3>第四屏</h3>
    <p>这是最后一屏</p>
  </div>
</div>
<script src="http://libs.baidu.com/jquery/1.7.2/jquery.js"></script>
<script src="./js/jquery.fullPage.js"></script>
<script>
$(function(){
	$('#fullPage').fullpage({
		sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', '#f90']
	});
});
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?319df46884458c3fbee36b0cc6e390e8";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>
</body>
</html>
